<template>
	<view class="box">
		<!-- 背景颜色 -->
		<view class="bg">

		</view>
		<view class="list">
			<view class="title f-w">
				<view class="bold f32">{{title}}</view>
				<view class="tag1"></view>
				<view class="f26 bold red">
					{{s_title}}
				</view>

			</view>
			<!-- 内容 -->
			<scroll-view scroll-y="true" class="scroll">
				<view class="card" v-for="(item,index) of list" :key="index">
					<view class="content f-w">
						<view class="left">
							<view class="img f-w" style="width: 100%;height: 100%;">
								<image :src="item.image" mode=""></image>
							</view>
						</view>
						<view class="right">
							<view class="one hide-line f28 bold">{{item.store_name}}</view>
							<view class="two fw-bt">
								<!-- 价格 -->
								<view class="f-w f24">
									<view class="red ">
										￥<text class="f30 bold">{{item.price}}</text>
									</view>

								</view>
								<my-numberBox :info="item" @cartDel='cartDel(index)' @cartAdd='cartAdd(index)'>
								</my-numberBox>
								<!-- 购买按钮 -->
								<!-- 	<view class="cart1 f-w">
									<view class="cart1-jian f-w" @click.stop="cartDel(item.id,index)" v-show="item.buy_num>0">
										<image src="https://jw.xzsw2021.com/static/client/icon_83@2x.png" mode="widthFix"></image>
									</view>
									<input type="number" v-model="item.buy_num" v-show="item.buy_num>0">
									<view class="cart1-add f-w" @click.stop="cartAdd(item.id,index)">
										<image src="https://jw.xzsw2021.com/static/client/icon_84@2x.png" mode="widthFix"></image>
									</view>
								</view>
								 -->

							</view>

						</view>
					</view>
				</view>
			</scroll-view>
		</view>
		<cart :list="carlist" @change='cartcancel' showcoupon='no' @buy='buying'></cart>
		<!--  -->
		<!-- <cart></cart> -->
	</view>
</template>

<script>
	import cart from '@/components/cart.vue'
	export default {
		components: {
			cart
		},
		data() {
			return {
				choosecart: [],
				carlist: [],
				time: 16 * 3600 * 1000, //倒计时时间
				list: [],
				value: 0,
				id: '',
				title: '',
				s_title: ''
			}

		},
		onLoad(e) {
			this.id = e.id
			uni.setNavigationBarTitle({
				title:e.title
			})
			this.title = e.title
			this.s_title = e.s_title
			this.getlist()

		},
		methods: {

			// 根据菜市场id获取秒杀的商品
			getlist() {
				this.$request('magic', {
					ids: JSON.parse(this.id)
				}).then(res => {
					let list = res.data
					this.getcartlist(list)
				})
			},
			// 获取购物车的列表
			// 获取购物车的列表
			getcartlist(arr) {
				let arr2 = []
				this.$request('user/cart/lst', {}, 'GET').then(res => {
					let list = res.data.list
					list.forEach(item => {
						item.list.forEach(item2 => {
							arr.forEach(item3 => {
								if (item2.product_id == item3.product_id) {
									item2.check = true
									item3.cartnum = item2.cart_num
									item3.cart_id = item2.cart_id
									arr2.push(item2)
								}

							})
						})
					})
					this.list = arr
					this.carlist = arr2
				})
			},
			buying() {
				let arr = []
				let list = this.carlist
				list.forEach(item => {
					if (item.check && item.cart_num > 0) {
						arr.push(item)
					}

				})
				uni.navigateTo({
					url: "/pages/client/order/order-sure/order-sure?arr=" + JSON.stringify(arr)
				})


			},

			cartcancel(e) {
				this.choosecart = e
				this.getlist()
			},


			// 购物车减去
			cartDel(e) {
				let list = this.list
				let item = list[e]
				uni.showLoading({
					mask: true
				})
				this.$request('user/cart/change/' + item.cart_id, {
					cart_num: item.cartnum - 1
				}).then(res => {
					if (res.status == 200) {
						uni.showToast({
							title: "添加成功"
						})
						this.getlist()
						// list[e].cartnum--
						// this.cate3_list=list
						// this.$forceUpdate()

					}
				})
			},
			// 购物车加
			cartAdd(e) {
				let list = this.list
				let item = list[e]
				let data = {
					cart_num: 1,
					is_new: 0,
					product_attr_unique: item.attrValue[0].unique,
					product_id: item.product_id,
					product_type: item.product_type
				}
				uni.showLoading({
					mask: true
				})
				this.$request('user/cart/create', data).then(res => {
					if (res.status == 200) {
						uni.showToast({
							title: "添加成功"
						})
						this.getlist()
					}
				})
			},

		}
	}
</script>
<style>
	page {
		background-color: #F5F5F5;
	}
</style>
<style lang="scss" scoped>
	.box {
		.myimg {
			width: 100%;
			height: 100%;
		}

		.red {
			color: #F83535;
		}

		position: relative;

		.bg {
			position: absolute;
			width: 750rpx;
			height: 375rpx;
			background: linear-gradient(180deg, #109C7A 0%, #F5F5F5 100%);
		}

		.list {
			margin: 0 auto;
			position: relative;
			width: 690rpx;
			height: 100vh;
			background: #FFFFFF;
			border-radius: 20rpx 20rpx 0rpx 0rpx;
			padding: 0 30rpx;
			background-color: #fff;
			box-sizing: border-box;
			overflow: hidden;

			.title {
				margin: 15rpx 0 0;

				.tag1 {
					margin: 0 10rpx;
					width: 2rpx;
					height: 26rpx;
					background: #333;
				}
			}

			.scroll {
				height: calc(100vh - 50rpx);
			}

			.card {

				// margin: 26rpx 0 0;
				.content {
					padding: 30rpx 0 30rpx;
					border-bottom: 1rpx solid #EEEEEE;

					.left {
						flex-shrink: 0;
						width: 190rpx;
						height: 190rpx;
						background-color: #18BC37;

						image {
							width: 100%;
							height: 100%;
							border-radius: 12rpx;
						}
					}

					.right {
						position: relative;
						flex: 1;
						margin-left: 15rpx;
						height: 190rpx;
						overflow: hidden;

						.two {
							margin: 104rpx 0 0;

							// align-items: flex-end;
							.c999 {
								margin: 0 0 0 10rpx;
							}
						}

						.cart1 {
							// width: 140rpx;
							height: 50rpx;

							input {
								width: 60rpx;
								margin: 0 10rpx;
								font-weight: 600;
								font-size: 28rpx;
								text-align: center;
							}

							.cart1-jian,
							.cart1-add {
								width: 40rpx;
								height: 40rpx;

								image {
									@extend .myimg;
								}
							}
						}
					}
				}
			}
		}
	}
</style>
